HTML5 Hap Pas Hapi: Rregullimi i tekstit

Skender Mustafi

Autor: Skender Mustafi

Tanimë programuam bazën mbi të cilën mund t’i hedhim elementet për të programuar ueb faqen tonë. Në këtë mësim do të trajtojmë hedhjen, përpunimin dhe rregullimin e tekstit ku do të kemi rastin t’i mësojmë disa etiketa shumë me vlerë për t’i realizuar këto veprime.

Ne mund të hedhim tekstin e dëshiruar brenda kornizave të etiketës <body></body> pa pasur nevojë për asnjë etiketë tjetër. Kështu do të kemi një tekst i cili paraqitet në pjesën e sipërme, nga e majta, të faqes, pa asnjë efekt. Le të provojmë:

<DOCTYPE! html>
<html>

<head>
<title>HTML5 Hap Pas Hapi: Rregullimi i Tekstit</title>
</head><body>
Tanimë programuam bazën mbi të cilën mund t'i hedhim elementet për të programuar ueb faqen tonë. Në këtë mësim do të trajtojmë hedhjen, përpunimin dhe rregullimin e tekstit ku do të kemi rastin t'i mësojmë disa etiketa shumë me vlerë për t'i realizuar këto veprime.
</body>
</html>

Kodin mund të e shkruani në një skedë tjetër ose në atë të mësimit të kaluar.

Ajo që duhet theksuar që në fillim është se HTML5 nuk mbështetë etiketën <font></font>, por rregullimi i tekstit bëhet në mënyra tjera përmes aplikimit të CSS etiketave.

Për ta organizuar tekstin në vija apo në paragrafë mund të mund të shfrytëzojmë etiketa të ndryshme edhe atë:

  • <br> – për ti ndarë rreshtat
  • <p></p> – për të ndarë tekstin në paragrafë. Teksti i cili gjendet brenda etiketës paraqet një paragraf.
  • <pre></pre> – për të ndarë rreshtat pa pasur nevojë që pas secilit rresht të vendoset një thyerëse, pra <br>. Kjo është e mirë atëherë kur kemi të bëjmë me poezi.

Për të provuar këto etiketa aplikoni në shembullin e mësipërm. Kështu, futeni tekstin mes etiketës <p></p> dhe pas fjalisë së parë vendosni etiketën <br>. Për të provuar etiketën <pre></pre> kopjoni poezinë më poshtë dhe futeni në mes të kësaj etikete.

fillojnë neveritjet
dhe e pyes
ç’bën ti përpara e shfrenuar
qeshin edhe merimangat
nga pyetja
e çuditshme
pastaj për çudin time
sorrat vishen si nuse
në fund të ëndrrës
në mesditë

Rezultati që duhet të fitoni është si më poshtë:

htmlMë tej, teksti mund të dekorohet dhe theksohet përmes etiketave:

  • <b></b> – bën trashjen e tekstit
  • <i></i> –  bën pjerrësimin e tekstit
  • <u></u> – bën nënvijëzimin e tekstit
  • <mark></mark> – ngjyron tekstin si të përzgjedhur
  • <abbr title=”sqarimi”></abbr> – në prapavijë vendosë përshkrim ose sqarim për fjalët e caktuara. Ky lloj kodi është i përshtatshëm për sqarimin e domethënies së akronimeve. Për të parë efektin e kësaj etikete duhet të kaloni me mi mbi tekst. Ajo që duhet të dini është se në faqet pa përcaktim të veçantë të CSS-ve teksti nuk dallon me asgjë nëse ka në prapavijë këtë etiketë ose jo.
  • <sup></sup> – mundëson vendosjen e super-skriptës në tekst shembull 2 në fuqinë e <sup>4</sup>: 24
  • <sub></sub> – mundëson vendosjen e nën-skriptës në tekst siç është fusnota fusnota
  • <kbd></kbd>, <code></code> dhe <samp></samp> – mundësojnë që shkronjat të shtrihen në mënyrë të barabartë. Kështu që një tekst i shkruar me ddddd zë më pak vend se një tekst i shkruar me iiiii. Me përdorimin e njërës nga këto etiketa që të dy tekstet zënë hapësirë të njëjtë vendi:  ddddd iiiii
  • <blockquote></blockquote> – ofron hapsirë për vendosjen e citateve.
  • <code></code> – paraqet tekstin në form të kodit kompjuterik

  • <em></em> – pjerrëson tekstin

  • <kbd></kbd> – një lloj njoftuesi që teksti duhet shkruar me tastierë.

  • <small></small> – zvogëlon madhësinë e tekstit

  • <strong></strong> – bën trashjen e tekstit

  • <bdo></bdo> – cakton drejtimin e tekstit: <bdo dir=”rtl”> Teksti shkruhet nga e djathta në të majtë</bdo>

  • <cite></cite> – definon titullin e punës

  • <del></del> – i vë vi në mes fjalës që gjendet mes etiketës

  • <ins></ins> – e nënvijëzon tekstin në mes etiketës

Ndarja e titujve të materialeve mund të bëhet përmes etiketave h të cilat mund të jenë nga 1 deri në 6. Vlerat e paracaktuara të këtyre etiketave janë si më poshtë, por këto vlera mund të ndryshohen dhe rregullohen sipas dëshirës kur këto etiketa kombinohen me CSS kod. (Pamjet e më poshtme të h etiketave janë ndryshuar nga ndikimi i kodit në faqen time, përndryshe këto etiketa vetëm zmadhojnë shkronjat me vlerat e tyre bazë. Këtë mund të e vërtetoni duke testuar kodin në skedën ku testoni shembujt ose të hapni një skedë të re html.)

  • <h1> Titulli</h1>

  • <h2> Titulli</h2>

  • <h3> Titulli</h3>

  • <h4> Titulli</h4>

  • <h5> Titulli</h5>
  • <h6> Titulli</h6>

Të gjitha etiketat e sipër trajtuara janë të paraqitura me karakteristikat bazë të tyre. Pra, vetëm me bashkëngjitjen e tyre në tekst, teksti merr ato karakteristika. Ajo që do të trajtojmë në mësimin e radhës është, bashkëngjitja e CSS parametrave dhe tipareve për të bërë këto etiketa edhe më atraktive dhe më funksionale.

Po këto i keni lexuar?